use google sheet be simple CMS

前些日子接了一個 case，因為只有一個工程師加上一個設計，卻要完成有後台的網站

因此討論後決定用 wordpress + google sheet

以前寫程式時，很排斥 wordpress 覺得這都是個速成的東西，讓專業變成不專業

但實際研究過後，發現真的是很速成的東西呢！！許多 server 的平台都有提供一鍵完成，只要付平台費就可以獲得一個有前台跟後台的網站，某方面來說真的讓專案開發時程可以大幅縮短

拉回正題，因為專案需求所以我們需要滿足以下幾個需求

客戶使用 google sheet 完成前台頁面的變化
google sheet 可以有個 api 讓 wordprss 可以 request

原先預想運用 google sheet 可以直接用 “發佈到網路”，如果這樣使用 ajax 引用的話會有 CORS 的問題

注意有些網路上會說 ~~透過 Google Sheet API 拿回來的資料預設會帶有 CORS Header，所以不受跨 domain 存取限制，很方便吧！~~

但僅限於舊版 google sheet 能這樣做，現在的版本都不行了

I've confirmed that this is a bug in the Drive API, but it is only affecting the exportLinks for New Google Sheets file. Old Google Sheets and other Google file types should work correctly. I've raised it with the team, but it's unclear how long it will take to fix. Unfortunately there are no simple workarounds, and the only solution would be to introduce a server-side component that would download the file and then pass it along to the client.

但如果真的想要只用 google sheet 做 api 可以用 Tabletop javascript 做引入，就不回有 CORS 的問題了

因為直接從 google sheet 下來的資料其實有太多不是我們想要的，如果使用 wordpress 做 request 的話，會額外花太多精力在洗資料，所以最後決定使用 google app script 來做 google sheet 的轉接

google app script 在接 google 相關服務其實都蠻方便的，比如說 google drive 或是 google calendar 等

完成 sheet 的編輯後，在雲端硬碟新增一個 google app script，如果沒有就點擊更多… 尋找

用 google app script 不用 "發佈到網路"

google app script 是吃 doGet() 開始的

function doGet(e) {
  // Change Spread Sheet url
  var ss = SpreadsheetApp.openByUrl("google sheet 的 URL");

  // Sheet Name, Chnage Sheet1 to Users in Spread Sheet. Or any other name as you wish
  var sheet = ss.getSheetByName("該 sheet 的 name (下方該表單名稱)");

  return getUsers(sheet);
}

function getUsers(sheet) {
  var jo = {};
  var dataArray = [];

  // collecting data from 3nd Row , 1st column to last row and last column
  var rows = sheet
    .getRange(3, 1, sheet.getLastRow() - 1, sheet.getLastColumn())
    .getValues();

  for (var i = 0, l = rows.length; i < l; i++) {
    var dataRow = rows[i];
    var record = {};
    record["secondary_category"] = dataRow[2];
    record["name"] = dataRow[3];

    dataArray.push(record);
  }

  jo.user = dataArray;

  var result = JSON.stringify(jo);
  return ContentService.createTextOutput(result).setMimeType(
    ContentService.MimeType.JSON
  );
}